@extends('layouts.front')

@section('content')

@push('styles')
<style>
    a.address-item-fa {
        color: #333;
    }
</style>
@endpush

<div v-cloak class="address">
    <div v-for="( item, index ) in list" :key="index" class="address-item">
        <div class="address-item-b boder-b">
            <div class="address-item-bh">
                <span v-if="item.is_default" class="tag-default" >[默认]</span>
                <span class="name">@{{ item.contact_name }}</span>
                <span class="tel" >@{{ item.contact_tel }}</span>
            </div>
            <div class="address-item-bf">
                @{{ item.area }} @{{ item.address }}
                <a v-if="select" @click="selectAddress(item)" href="javascript:;" class="weui-btn weui-btn_mini weui-btn_primary address-use">使用</a>
            </div>
        </div>
        <div class="address-item-f boder-b">
            <a :href="'/address/' + item.id + '/edit' + (select ? '?select=1' : '')" class="address-item-fa boder-r">
                编辑
            </a>
            
            <div @click="setDefault(item) " class="address-item-fa">
                设置默认
            </div>
        </div>
    </div>

    <a class="bottom-bar" :href="'/address/create/' + (select ? '?select=1' : '')">
        添加新收货地址
    </a>
</div>

@section('tabbar')
@endsection

@push('scripts')
<script>
    var vm = new Vue ({
        el: '#app',
        data: function(){
            return {
                pid: 0,
                list: [],
                select: @if($action === 'select') 1 @else 0 @endif,
                loading: null,
            }
        },
        created: function(){
            this.loading = weui.loading('loading')
            this.getAddress()
        },
        methods: {
            // 选择地址
            selectAddress: function(item) {
                window.location.href = '/shopping/checkOut?aid=' + item.id;
            },
            // 获取地址
            getAddress: function() {
                var self = this;
                $.ajax({
                    type: 'get',
                    url: '{{ route("uaddress") }}',
                    dataType: 'json',
                    success: function(res) {
                        self.loading.hide();
                        if (res.status === 'success') {
                            self.list = res.data
                        }
                    }
                })
            },
            // 设置默认
            setDefault: function(address) {
                let loading = weui.loading('请稍等...');
                var self = this;
                $.ajax({
                    type: 'post',
                    url: '/address/setDefault',
                    dataType: 'json',
                    data: { id: address.id },
                    success: function(res) {
                        loading.hide();
                        if (res.status === 'success') {
                            self.getAddress()
                        }
                    }
                })
            },
            // 编辑
            edit: function() {   
            }
        }
    })

    $(document).ready(function() {
        window.addEventListener("popstate", function(e) {
            if(vm.select) {
                window.location.href = '/shopping/checkOut';
            } else {
                window.location.href = '/member';
            }
        }, false); 
        var state = { 
            title: "title", 
            url: "#"
        }; 
        window.history.pushState(state, "title", "#");
    });
</script>
@endpush
@endsection
